<template>
    <div class='carousel' ref=carousel>
      <el-carousel :interval="4000" type="card" style='height:350px;width:1150px;' arrow="always">
        <el-carousel-item v-for="item in list" :key="item.id">
            <img title='音乐' v-lazy='item.picUrl'>
        </el-carousel-item>
       </el-carousel>
    </div>
</template>

<script>
export default {
      data () {
            return {
                value2: 0,
                list:{}
            }
        },
        mounted:function(){
                 this._getMusic();
        },
        methods:{
                _getMusic(){
                let target = this;
               target.fetch({
                   url:'/top/album',
                   method:'GET',
                   params:{
                       offset:0,
                       limit:6
                   }
               }).then(function (response) {
                  target.list = response.data.albums;
                  console.log(target.list,677);
                   
               });
            },
            show(id){

            }
        }
}
</script>
<style scoped>
.el-carousel__container{
    overflow: hidden;
}
.el-carousel__container img{
    width: 100%;
    height: 100%;
}
.carousel{
    width: 1182px;
    height: 336px;
    margin: 0 auto;
    overflow: hidden
}
</style>


